import 'package:amway_superapp_creator_plugin/config/colors_config.dart';
import 'package:amway_superapp_creator_plugin/widget/slide_button.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_screenutil/screenutil.dart';

class SelectedCombination extends StatefulWidget {
  @override
  _SelectedCombinationState createState() => _SelectedCombinationState();
}

class _SelectedCombinationState extends State<SelectedCombination> {
  final list = List();

  @override
  void initState() {
    list
      ..add("value")
      ..add("value")
      ..add("value")
      ..add("value")
      ..add("value")
      ..add("value")
      ..add("value")
      ..add("value");
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        leading: IconButton(
          icon: Icon(Icons.keyboard_arrow_left, color: ColorsConfig.c_2c2c2c),
          onPressed: () {},
        ),
        centerTitle: true,
        title: Text(
          "精选组合",
          style: TextStyle(
              color: ColorsConfig.c_2c2c2c, fontSize: ScreenUtil().setSp(18)),
        ),
      ),
      body: Column(
        children: [
          Card(
              color: ColorsConfig.c_33fafafa,
              shape: RoundedRectangleBorder(
                  side: BorderSide(width: 0.5, color: ColorsConfig.c_e6e6e6),
                  borderRadius: BorderRadius.circular(12)),
              elevation: 0,
              margin: EdgeInsets.fromLTRB(12, 12, 12, 6),
              child: Row(
//            mainAxisSize: MainAxisSize.min,
                children: [
                  Checkbox(value: true, onChanged: null),
                  Text(
                    "在精选组合中展示官方产品组合",
                    style: TextStyle(
                        color: Colors.black, fontSize: ScreenUtil().setSp(16)),
                  )
                ],
              )),
          Expanded(
              flex: 1,
              child: Container(
                color: ColorsConfig.c_f3f3f3,
                child: ListView(
                  children: getSlides(),
                ),
              ))
        ],
      ),
    );
  }

  List<SlideButton> getSlides() {
    final list = List<SlideButton>();
    for (var i = 0; i < this.list.length; i++) {
      var key = GlobalKey<SlideButtonState>();
      var slide = SlideButton(
        key: key,
        singleButtonWidth: 80,
        onSlideStarted: () {
          list.forEach((slide) {
            if (slide.key != key) {
              slide.key.currentState?.close();
            }
          });
        },
        child: Container(
          child: _item(i),
          width: double.infinity,
        ),
        buttons: <Widget>[
          buildAction(i, key, "删除", Colors.red, () {
            key.currentState.close();
          }),
        ],
      );
      list.add(slide);
    }
    return list;
  }

  InkWell buildAction(int index, GlobalKey<SlideButtonState> key, String text,
      Color color, GestureTapCallback tap) {
    return InkWell(
      onTap: tap,
      child: Container(
        margin:
            EdgeInsets.fromLTRB(0, 6, 14, index == list.length - 1 ? 12 : 6),
        alignment: Alignment.center,
        color: Colors.redAccent,
        width: 100,
        child: Text("取消"),
      ),
    );
  }

  Widget _item(int index) {
    return Card(
      color: Colors.blue,
      elevation: 0,
      margin: EdgeInsets.fromLTRB(
          12, 6, 12, index == this.list.length - 1 ? 12 : 6),
      child: Row(
        children: [_image(), _rItem()],
      ),
    );
  }

/*
* 图片
* */
  Widget _image() {
    return Container(
        alignment: Alignment.centerLeft,
        margin: EdgeInsets.fromLTRB(14, 14, 14, 14),
        child: Image.network(
          "https://pic2.zhimg.com/v2-639b49f2f6578eabddc458b84eb3c6a1.jpg",
          width: ScreenUtil().setWidth(70),
          height: ScreenUtil().setHeight(90),
          fit: BoxFit.cover,
        ));
  }

  Widget _rItem() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [_title(), _moreImage()],
    );
  }

/*
* 更多图片
* */
  Widget _moreImage() {
    return Row(
      children: [_icon(), _icon(), _icon()],
    );
  }

  Widget _icon() {
    return Container(
        margin: EdgeInsets.fromLTRB(0, 5, 10, 0),
        width: ScreenUtil().setWidth(44),
        height: ScreenUtil().setWidth(44),
        child: Card(
          color: Colors.white,
          child: Icon(Icons.camera_alt),
          shape: RoundedRectangleBorder(
              side: BorderSide(width: 0.5, color: ColorsConfig.c_e5e5e5),
              borderRadius: BorderRadius.circular(6)),
        ));
  }

  /*
  * 标题
  * */
  Widget _title() {
    return Container(
        margin: EdgeInsets.only(bottom: 5),
        child: Text("2020上半年最热门的运动饮料",
            style: TextStyle(
                color: Colors.black, fontSize: ScreenUtil().setSp(18))));
  }
}
